import React from 'react';
import { Button } from 'antd-mobile';
import timer from '@/utils/timer';

export default function(props: any) {
  const { order } = props;
  const handleOrder = (id?: number) => {
    props?.onClick(id);
  };
  const orderBtn = () => {
    if (!order?.id) {
      return (
        <Button
          className="info-btn"
          type="warning"
          onClick={() => handleOrder()}
        >
          预定
        </Button>
      );
    }
    if (order?.isPayed === 0) {
      return (
        <Button
          className="info-btn"
          type="warning"
          onClick={() => handleOrder(order?.id)}
        >
          取消预定
        </Button>
      );
    }
    if (order?.isPayed === 1) {
      return (
        <Button className="info-btn" type="warning">
          居住中
        </Button>
      );
    }
  };

  return (
    <div className="info">
      <div className="info-title">{props?.detail?.name}</div>
      <div className="info-msg">简介：{props?.detail?.info}</div>
      <div className="info-price">价格：{props?.detail?.price}</div>
      <div className="info-time">
        发布时间：{timer(props?.detail?.publishTime)}
      </div>
      <div className="info-time">
        开始出租：{timer(props?.detail?.startTime, '')}
      </div>
      <div className="info-time">
        结束出租：{timer(props?.detail?.endTime, '')}
      </div>
      {orderBtn()}
    </div>
  );
}
